<template>
  <div class="content-wraper">
    <div class="search-box">
      <el-form label-width="100px" :inline="true">
        <el-form-item label="合同类型">
          <el-select v-model="queryContractType" placeholder="请选择">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="年度查询" prop="queryYear">
          <el-date-picker v-model="queryYear" type="year" value-format="yyyy" style="width: 100%" placeholder="选择年" />
        </el-form-item>
        <el-form-item label="单位名称">
          <el-input v-model="queryUnitName" />
        </el-form-item>
        <el-button type="primary" icon="el-icon-search" @click="search()">查询</el-button>
        <el-button type="warning" icon="el-icon-refresh" @click="reset()">重置</el-button>
        <el-tag type="success" style="float: right; margin-top: 5px;">
          <span>合同金额合计:</span><span>{{ displaySumAmount }}元</span>
        </el-tag>
      </el-form>
    </div>
    <div class="detail">
      <com-table
        :data="dataList"
        :columns="columns"
        :total="total"
        @pageChange="pageChange"
      >
        <template v-slot:contractSignTime="{ row: { contractSignTime } }">
          {{ dateFormat(contractSignTime) }}
        </template>
      </com-table>
    </div>
  </div>
</template>

<script>
import { getContractLedgerList } from '@/api/bigManage'
import moment from 'moment'
import { getDictName } from '@/utils/comm'
import { bidInfoMode, bidInfoType, workflowStatus } from '@/utils/dicData'
export default {
  name: 'BidInfo',
  components: {},
  data() {
    return {
      getContractLedgerList,
      name: '',
      displaySumAmount: 0,
      getDictName,
      bidInfoMode,
      bidInfoType,
      workflowStatus,
      options: [
        {
          value: '1',
          label: '合同管理-总承包合同'
        },
        {
          value: '2',
          label: '合同管理-劳务分包合同'
        },
        {
          value: '3',
          label: '合同管理-材料采购合同'
        },
        {
          value: '4',
          label: '合同管理-设备采购合同'
        },
        {
          value: '5',
          label: '合同管理-设备租赁合同'
        },
        {
          value: '6',
          label: '合同管理-其他合同'
        },
        {
          value: '7',
          label: '自营管理-销售合同'
        },
        {
          value: '8',
          label: '自营管理-劳务合同'
        },
        {
          value: '9',
          label: '自营管理-材料合同'
        },
        {
          value: '10',
          label: '自营管理-机械设备采购合同'
        },
        {
          value: '11',
          label: '自营管理-机械设备租赁合同'
        },
        {
          value: '12',
          label: '自营管理-其他合同'
        }
      ],
      queryContractType: '1',
      queryYear: '',
      queryUnitName: '',
      dataList: [],
      total: 0,
      pageParams: {
        pageNum: 1,
        pageSize: 10
      },
      showModal: false,
      optType: 'add',
      unitDetail: {},
      columns: [
        {
          label: '项目名称',
          prop: 'projectName'
        },
        {
          label: '部门名称',
          prop: 'departmentName'
        },
        {
          label: '乙方名称',
          prop: 'employeeName'
        },
        {
          label: '甲方名称',
          prop: 'employerName'
        },
        {
          label: '合同名称',
          prop: 'contractName'
        },
        {
          label: '合同金额(元)',
          prop: 'contractAmount'
        },
        {
          label: '合同签订时间',
          slots: 'contractSignTime',
          prop: 'contractSignTime'
        },
        {
          label: '备注',
          prop: 'remark'
        }
      ]
    }
  },
  mounted() {
    this.getDataList()
  },
  methods: {
    dateFormat(data) {
      if (data) {
        return moment(data).format('YYYY-MM-DD')
      } else {
        return ''
      }
    },
    pageChange(data) {
      this.pageParams = data
      this.getDataList()
    },
    getDataList() {
      const params = {
        ...this.pageParams,
        contractType: this.queryContractType,
        year: this.queryYear,
        unitName: this.queryUnitName
      }
      getContractLedgerList(params).then((res) => {
        const { data, total } = res.data || {}
        if (data) {
          this.dataList = data
          this.dataList.forEach(element => {
            if (element.contractSignTime) {
              element.contractSignTime = moment(element.contractSignTime).format('YYYY-MM-DD')
            }
          })
          this.total = total - 0
          // 获取合同金额合计
          if (data.length > 0) {
            this.displaySumAmount = data[0].contractAmountSum
          }
        }
      })
    },
    search() {
      this.pageParams.pageNum = 1
      this.getDataList()
    },
    reset() {
      this.queryContractType = '1'
      this.queryYear = ''
      this.queryUnitName = ''
      this.getDataList()
    }
  }
}
</script>

<style lang="scss" scoped>
.search-box {
  height: 50px;
}
.detail {
  height: calc(100% - 50px);
}
</style>
